<template>
	<view :class="currentTheme">
		<a-nabbar name="邀请店家" />
		<mescroll-body ref="mescrollRef" @init="mescrollInit" @up="upCallback" @down="downCallback">
			<view class="u-padding-32">
				<item-search placeholder="搜素店家名称" @change="downCallback" v-model="form.nickname"></item-search>
				<view class="u-margin-top-20" v-for="(item,index) in dataList" :key="index">
					<item-box :paddinglr="20">
						<view class="u-padding-top-20">
							<view class="u-flex u-row-between u-col-top">
								<view class="u-flex">
									<item-image :type="'1'" :img="item.avatar" :size="120" />
									<view class="u-margin-left-56">
										<view class="u-font-32 box-title text-bold">{{item.nickname}}</view>
										<view class="u-margin-top-16 u-font-24">
											<text>信用分：</text>
											<text class="text-color-txtTheme">{{item.creditScore}}</text>
										</view>
									</view>
								</view>
								<!-- <view class="u-flex u-flex-1 u-col-top  u-padding-right">
									<item-image :type="'1'" :img="item.avatar" :size="120" />
									<view class="u-margin-left-20 u-flex-1">
										<view class=" u-font-30 text-color-e6e6e6 u-margin-top-10">{{item.nickname}}
										</view>
										<view class=" u-font-22 text-color-B0B2D8 u-margin-top-20">
											<text>信用分：</text>
											<text>100</text>
										</view>
										<view class="history-list u-flex u-margin-top-30">
											<u-row style="width:100%">
												<u-col :span="4">
													<view class="text-color-ccc u-font-24 u-text-center history-item">
														已上{{item.inCarCount}}车</view>
												</u-col>
												<u-col :span="4">
													<view class="text-color-ccc u-font-24 u-text-center history-item ">
														已跳{{item.jumpCarCount}}车</view>
												</u-col>
												<u-col :span="4">
													<view class="text-color-ccc u-font-24 u-text-center ">
														已评测{{item.evaluationCount}}本</view>
												</u-col>
											</u-row>
										</view>
										<view class="text-color-DEDEDE u-font-24 u-margin-top-20">用户偏好：</view>
										<view class="u-flex u-margin-top-20 u-flex-wrap">
											<view :span="4" v-for="(c,i) in item.userPreferenceList" :key="i">
												<view class="u-margin-top-8 u-margin-right-10">
													<u-tag :text="c.categoryName" shape="circle" bg-color="#2F2D3A"
														border-color="#2F2D3A" color="#D0D2F9" />
												</view>
											</view>
										</view>
									</view>
								</view> -->
								<view>
									<item-btn width="166" height="70" @click="shareItem(item)">邀请测本</item-btn>
								</view>
							</view>
							<view class="u-margin-top-28">
								<item-number-list :list="returnNumberList(item)"></item-number-list>
							</view>
							<view class="u-margin-top-28">
								<u-row>
									<u-col span="3" v-for="(c,i) in item.userPreferenceList" :key="i">
										<view class="u-margin-bottom-28">
											<item-btn :bgColor="currentThemeObj.backgroundSecondColor" width="100%" height="56">
												<text class="content-desc-item">{{c.categoryName}}</text>
											</item-btn>
										</view>
									</u-col>
								</u-row>
							</view>
						</view>
					</item-box>
				</view>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import upCallback from '@/mixins/upCallbackMixin.js'
	import itemSearch from '@/components/itemSearch/itemSearch.vue';
	let WebIM = require("@/utils/WebIM")["default"];
	let msgType = require("@/components/chat/msgtype.js");
	let msgStorage = require("@/components/chat/msgstorage");
	import itemNumberList from '@/components/itemNumberList/itemNumberList.vue'
	export default {
		mixins: [upCallback],
		components: {
			itemSearch,itemNumberList
		},
		data() {
			return {
				form: {
					nickname: ''
				},
				apiType: 'product',
				name: 'getMatchUsers',
				apiModule: 'shopApi'
			};
		},
		onLoad(option) {
			this.form = option;
			this.form.driveCarId = option.id;
			const {
				hxPassword,
				hxUsername
			} = this.loginForm;
			getApp().globalData.login({
				hxPassword,
				hxUsername
			})
			this.valiDateMixin('issue')
		},
		computed: {
			loginForm() {
				return this.$store.getters.loginForm
			}
		},
		methods: {
			shareItem(item) {
				const me = this;
				let id = WebIM.conn.getUniqueId();
				const chatmsgtype = msgType.CUSTOM;
				let msg = new WebIM.message(chatmsgtype, id);
				msg.set({
					from: this.loginForm.hxUsername,
					customEvent: "CUSTOM",
					customExts: this.form,
					to: item.hxUsername,
					roomType: false,
					chatType: 'singleChat',
					success(id, serverMsgId) {
						console.log("成功了");
						me.$u.toast('邀请成功')
						disp.fire("em.chat.sendSuccess", id, me.textMsg);
					},
					fail(id, serverMsgId) {
						me.$u.toast('邀请失败')
						console.log("失败了");
					},
				});
				try {
					me.saveMessage(msg, chatmsgtype)
				} catch (error) {
					me.$u.toast('邀请失败')
					console.log("error", error);
				}
			},
			//保存消息
			saveMessage(msg, type) {
				WebIM.conn.send(msg.body);
				msgStorage.saveMsg(msg, type);
			},
			returnNumberList(item){
				return [{
					text:'已上车次',
					count:item.inCarCount
				},{
					text:'已跳车次',
					count:item.jumpCarCount
				},{
					text:'已评测',
					count:item.evaluationCount
				}]
			}
		},
	}
</script>

<style lang="scss" scoped>
	.history-item {
		border-right: 1px solid #9B9CC0;
	}
</style>
